body {
    height: 100%;
    width: 100%;
    font-size: 12px;
}
.window { 
    border:1px solid #346789;
    box-shadow: 2px 2px 19px #aaa;
    -o-box-shadow: 2px 2px 19px #aaa;
    -webkit-box-shadow: 2px 2px 19px #aaa;
    -moz-box-shadow: 2px 2px 19px #aaa;
    -moz-border-radius:0.5em;
    border-radius:0.5em;
    opacity:0.8;
    filter:alpha(opacity=80);
    width:110px; 
    height:74px;
    text-align:center;
    z-index:20; 
    position:absolute;
    background-color:#eeeeef;
    color:black;
    font-family:helvetica;
    padding:0.5em;
    cursor:pointer;
}
.window:hover {
    box-shadow: 2px 2px 19px #444;
    -o-box-shadow: 2px 2px 19px #444;
    -webkit-box-shadow: 2px 2px 19px #444;
    -moz-box-shadow: 2px 2px 19px #444;
    opacity:0.6;
    filter:alpha(opacity=60);
}
.window-content {
    height:100%;
    width:100%;
    vertical-align:middle;
    text-align:center;
}

.active {
	border:1px dotted green;
}
.hover {
	border:1px dotted red;
}

.window1 {background-color:#FFBC18;}
.window2 {background-color:#50C625;}
.window3 {background-color:#F4A8BD;}
.window4 {background-color:#F4A8BD;}
.window5 {background-color:#D7D7D7;}
.explanation { 
	position:fixed; 
	left:2px; top:2px;
	background-color:white;
	border:2px solid #ddd; 
	padding:10px 5px;
	opacity:0.9;
	z-index:5000;
	-moz-border-radius:5px;
	border-radius:5px;
	filter:alpha(opacity=80);
	box-shadow: 2px 2px 19px #aaa;
   -o-box-shadow: 2px 2px 19px #aaa;
   -webkit-box-shadow: 2px 2px 19px #aaa;
   -moz-box-shadow: 2px 2px 19px #aaa;
}
